<script type="text/javascript" src="${ctxPath}/js/pages/template_nav.js"></script>
<link rel="stylesheet" href="${ctxPath}/css/pages/template_nav.css">
<div class="pageheader">
    <h2><i class="fa fa-pencil"></i> 模板管理 <span>模板导航页</span></h2>

    <div class="breadcrumb-wrapper">
        <span class="label">当前位置:</span>
        <ol class="breadcrumb">
            <li><a href="index.html">Bracket</a></li>
            <li><a href="general-forms.html">模板管理</a></li>
            <li class="active">模板导航页</li>
        </ol>
    </div>
</div>

<div class="contentpanel">
    <div class="panel panel-default">
        <div class="panel-heading">
            <div class="panel-btns">
                <a href="javascript:;" onclick="addTemplateNav()" id="addUserInfoBtn" class="tooltips"
                   data-toggle="tooltip" title="增加导航轮播"
                   data-original-title="Add New"><i class="glyphicon glyphicon-plus"></i></a>
            </div>
            <h4 class="panel-title">模板导航页</h4>

            <p>
                模板首页头部导航轮播图管理，一次只显示三张</p>
        </div>
        <div class="panel-body">
            <div class="tab-content mb30">
                <div class="tab-pane active" id="home">
                    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                        <!-- Indicators -->
                        <ol class="carousel-indicators">
                            <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                            <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                            <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                        </ol>

                        <!-- Wrapper for slides -->
                        <div class="carousel-inner" role="listbox">
                            <div class="item active">
                                <img src="${ctxPath}/images/desktop1.jpeg"/>

                                <div class="carousel-caption">
                                    <p>图片摘要：这张图片的摘要说明是发挥如何无法hi而合肥日均更IER级hi而</p>
                                    <button class="btn btn-primary">编辑</button>
                                    <button class="btn btn-danger">删除</button>
                                </div>
                            </div>
                            <div class="item">
                                <img src="${ctxPath}/images/desktop1.jpeg"/>

                                <div class="carousel-caption">
                                    <p>
                                        图片摘要：>图片摘要：这张图片的摘要说明是发挥如何无法hi而合肥日均更IER级hi而这张图片的摘要说明是发挥如何无法hi而合肥日均更IER级hi而这张图片的摘要说明是发挥如何无法hi而合肥日均更IER级hi而这张图片的摘要说明是发挥如何无法hi而合肥日均更IER级hi而</p>
                                    <button class="btn btn-primary">编辑</button>
                                    <button class="btn btn-danger">删除</button>
                                </div>
                            </div>
                            <div class="item">
                                <img src="${ctxPath}/images/desktop1.jpeg"/>

                                <div class="carousel-caption">
                                    <p>
                                        图片摘要：>图片摘要：这张图片的摘要说明是发挥如何无法hi而合肥日均更IER级hi而这张图片的摘要说明是发挥如何无法hi而合肥日均更IER级hi而这张图片的摘要说明是发挥如何无法hi而合肥日均更IER级hi而这张图片的摘要说明是发挥如何无法hi而合肥日均更IER级hi而</p>
                                    <button class="btn btn-primary" onclick="editTemplateNav()">编辑</button>
                                    <button class="btn btn-danger" onclick="delTemplateNav()">删除</button>
                                </div>
                            </div>
                        </div>

                        <!-- Controls -->
                        <a class="left carousel-control" href="#carousel-example-generic" role="button"
                           data-slide="prev">
                            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                            <span class="sr-only">Previous</span>
                        </a>
                        <a class="right carousel-control" href="#carousel-example-generic" role="button"
                           data-slide="next">
                            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                            <span class="sr-only">Next</span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--新增导航轮播图-->
<div class="modal fade" id="addTemplateNavModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">新增导航轮播图</h4>
            </div>
            <div class="modal-body">
                <form enctype="multipart/form-data" method="post">
                    <div class="form-group">
                        <label>导航图片摘要</label>
                        <input name="navDigest" type="text" class="form-control" id="addNavDigest" placeholder="可以为空！">
                    </div>
                    <div class="form-group">
                        <label>导航图片顺序</label>
                        <select name="navOrder" id="addNavOrder" class="form-control">
                            <option value="1">1</option>
                            <option value="2">2</option>
                            <option value="3">3</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label>导航图片</label>
                        <div id="picNavContainer" class="form-control">
                            <div id="picNav"></div>
                        </div>
                       <!-- <input name="navPic" id="addNavPic" type="file" class="form-control" placeholder="不能为空!">-->
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">关闭</button>
                <button type="submit" class="btn btn-primary" onclick="confirmAddTemplateNav()">确定</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div><!-- /.modal -->
<!--编辑导航轮播图-->
<div class="modal fade" id="editTemplateNavModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">新增导航轮播图</h4>
            </div>
            <div class="modal-body">
                <form>
                    <div class="form-group">
                        <label>导航图片摘要</label>
                        <input name="navDigest" id="editNavDigest" type="text" class="form-control" id="" placeholder="可以为空！">
                    </div>
                    <div class="form-group">
                        <label>导航图片顺序</label>
                        <select name="navOrder" id="editNavOrder" class="form-control">
                            <option value="1">1</option>
                            <option value="2">2</option>
                            <option value="3">3</option>
                        </select>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary">确定</button>
            </div>
            <!-- /.modal-dialog -->
        </div>
    </div>
    </div>
    <!-- /.modal -->